const { defineConfig } = require("@vue/cli-service");
const webpack = require("webpack");
const { resolve } = require('path');
const { ModuleFederationPlugin } = require("@module-federation/enhanced");

module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave: false,
  devServer: {
    port: 3222,
    host: '0.0.0.0',
    headers: {
      "Access-Control-Allow-Origin": "*",
      "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, PATCH, OPTIONS",
      "Access-Control-Allow-Headers":
        "X-Requested-With, content-type, Authorization",
    }
  },
  publicPath: process.env.NODE_ENV == 'development' ? 'http://localhost:3222/' : process.env.VUE_APP_PUBLIC_PATH,
  configureWebpack: {
    devtool: false,
    resolve: {
      alias: {
        '@': resolve(__dirname, 'src')
      }
    },
    experiments: {
      topLevelAwait: true
    },
    plugins: [
      new ModuleFederationPlugin({
        name: 'wxy_core',
        filename: 'wxy_core.js',
        exposes: {
          './components/web': './src/components/web/index.js',
          './http': './src/https/index.js',
          '.': './src/expose.js'
        },
        shared: {
          vue: { singleton: true, requiredVersion: '^3.5.0', eager: true },
          qs: { singleton: true, requiredVersion: '^6.14.0', eager: true },
        },
        dev: true
      })
    ]
  },
  chainWebpack: (config) => {
    config.optimization.delete('splitChunks');

    // config.module.rule('vue').use('vue-loader').tap((options) => ({
    //   ...options,
    //   reactivityTransform: true,
    //   compilerOptions: {
    //     scoped: true
    //   }
    // }));
  }
});
